<template name="newAdminEmailConfig">
{{#let txt="admin.emailConfig.newAdminEmailConfig"}}
  <h1>
    <ul class="admin-breadcrumbs">
      <li>{{#linkTo route="newAdminRoot"}}{{_ "admin.title"}}{{/linkTo}}</li>
      <li>{{_ "admin.emailConfig.name"}}</li>
    </ul>
  </h1>

  <h2>{{_ (con txt "outbound.title")}}</h2>

  {{#if emailUnconfigured}}
  <div class="flash-message warning-message">
    <p>
      {{{_ (con txt "outbound.warning")}}}
    </p>
  </div>
  {{/if}}

  <h3>
    {{_ (con txt "howItWorks.title")}}
  </h3>
  <p>
    {{{_ (con txt "howItWorks.explanation")}}}
  </p>

  {{#if hasSuccess}}<p class="flash-message success-message">{{_ (con txt "success")}}</p>{{/if}}
  {{#if hasError}}<p class="flash-message error-message">{{_ (con txt "error") errorMessage}}</p>{{/if}}

  <form class="email-form">
    <div class="form-group">
      <div class="host-port">
        <label class="host-box">
          {{_ (con txt "address.hostname")}}
          <input class="hostname" type="text" name="hostname" value="{{hostname}}" required />
        </label>
        <label class="port-box">
          {{_ (con txt "address.port")}}
          <input class="port" type="number" name="port" value="{{port}}" required />
        </label>
      </div>
      <span class="form-subtext">
        {{_ (con txt "address.subtext")}}
      </span>
    </div>

    <div class="form-group">
      <label>
        {{_ (con txt "username.label")}}
        <input class="username" type="text" name="username" value="{{username}}" />
      </label>
    </div>

    <div class="form-group">
      <label>
        {{_ (con txt "password.label")}}
        <input class="password" type="password" name="password" value="{{password}}" />
      </label>
    </div>

    <div class="form-group">
      <label>
        {{_ (con txt "returnAddress.label")}}
        <input class="from-address" type="email" name="return-address" value="{{returnAddress}}" required />
      </label>
      <span class="form-subtext">
        {{_ (con txt "returnAddress.subtext")}}
      </span>
    </div>

    <div class="button-row">
      <button class="submit" type="submit" disabled={{saveDisabled}}>{{_ (con txt "submitButton")}}</button>
      <button class="test" type="button" disabled={{testDisabled}}>{{_ (con txt "testButton")}}</button>
      <button class="disable" type="button" disabled={{disableDisabled}}>{{_ (con txt "disableButton")}}</button>
    </div>
  </form>

  {{#if showTestSendEmailPopup}}
    {{#modalDialogWithBackdrop onDismiss=closeTestPopupCallback}}
      {{> emailTestPopup smtpConfig=getSmtpConfig onDismiss=closeTestPopupCallback }}
    {{/modalDialogWithBackdrop}}
  {{/if}}

  {{#if showConfirmDisableEmailPopup}}
    {{#modalDialogWithBackdrop onDismiss=closeConfirmDisableEmailPopupCallback}}
      {{> emailDisablePopup onDismiss=closeConfirmDisableEmailPopupCallback}}
    {{/modalDialogWithBackdrop}}
  {{/if}}
{{/let}}
</template>

<template name="emailTestPopup">
{{#let txt="admin.emailConfig.emailTestPopup"}}
{{!-- Takes three arguments via data context:
       token: String (optional) Setup token to use to authorize a testSend request.
  smtpConfig: Object containing the SMTP config object to provide to testSend.
   onDismiss: Function to call when the Close button is clicked.
--}}
<h2>{{_ (con txt "title")}}</h2>
{{#if hasError}}
  {{#focusingErrorBox}}
    {{message}}
  {{/focusingErrorBox}}
{{/if}}
{{#if hasSuccess}}
  {{#focusingSuccessBox}}
    {{message}}
  {{/focusingSuccessBox}}
{{/if}}
<form class="email-test-form">
  <div class="form-group">
    <label>
      {{_ (con txt "testAddress.label")}}
      <input class="test-address" type="email" name="test-address" value="{{testAddress}}" required />
    </label>
  </div>
  <div class="button-row">
    <button type="submit" class="send-test-email" {{htmlDisabled}}>
      {{#if isSubmitting}}
      {{_ (con txt "pending")}}
      {{else}}
      {{_ (con txt "submitButton")}}
      {{/if}}
    </button>
    <button type="button" class="close-dialog">
      {{_ (con txt "closeButton")}}
    </button>
  </div>
</form>
{{/let}}
</template>

<template name="emailDisablePopup">
{{#let txt="admin.emailConfig.emailDisablePopup"}}
{{!-- Takes two arguments via data context:
       token: String (optional) Setup token to use to authorize a disableEmail call.
   onDismiss: Function to call when the Close button is clicked or the disableEmail call completes.
--}}
<h2>{{_ (con txt "title")}}</h2>
{{#if hasError}}
  {{#focusingErrorBox}}
    {{message}}
  {{/focusingErrorBox}}
{{/if}}

<p>
  {{_ (con txt "explanation")}}
</p>

<form class="email-disable-form">
  <div class="button-row">
    <button type="button" name="disable-email" class="danger" {{htmlDisabled}}>
      {{_ (con txt "disableButton")}}
    </button>
    <button type="button" name="close-dialog">
      {{_ (con txt "closeButton")}}
    </button>
  </div>
</form>
{{/let}}
</template>
